import React from 'react'
import { Checkbox, CheckboxGroup, Text, View } from '@tarojs/components'
import { Space } from '@/components/UiComponents'
const index = (props) => {
    const { data = {}, index, ChangeValue } = props
    const {
        title,
        label,
        require = false,
        desc,
        value = '',
        option = [],
    } = data
    return <View className='CollectWps_box_content'>
        <View className='CollectWps_label'>{require && <Text style={{ color: "red", right: 4 }}>*</Text>}{label}</View>
        <View className='CollectWps_desc'>{desc}</View>
        <View className=''>
            <CheckboxGroup onChange={(e) => {
                ChangeValue({ index, value: { otherValue: '', value: e.detail.value } })
            }} value={value}>
                <Space className='CollectWps_font24' style={{ width: "100%" }} direction='vertical'>
                    {option.map((item, key) => {
                        const { type, label } = item

                        return <Checkbox checked={value.includes(label)} value={label}><Text className='CollectWps_font24'>{label}</Text></Checkbox>

                    })}
                </Space>
            </CheckboxGroup>
        </View>

    </View>
}
export default index